<template>
  <el-container>
    <el-header class="index_header" style="height: 340px">
              <div id="logo">
              </div>
          <el-input v-model="searchData" prefix-icon="el-icon-search" placeholder="输入姓名搜索">
            <el-button type="danger" @click="search" slot="append" style="" disabled>搜索</el-button>
          </el-input>
    </el-header>
    <el-main style="padding: 0;height: calc(100%- 432px)">
      <el-row type="flex" justify="center">
        <el-col :span="24">
          <el-table :data="list":header-cell-style="{'text-align':'center'}" height="100%" max-height="100%">
            <el-table-column label="慈善机构" width="200" fixed>
              <template slot-scope="scope">
                <center>
                <el-button type="danger" @click="change(scope.row.name)" plain icon="el-icon-s-flag">
                  {{scope.row.name}}
                </el-button>
                </center>
              </template>
            </el-table-column>
            <el-table-column label="捐赠收入" prop="income"></el-table-column>
            <el-table-column label="公益支出" prop="outcome"></el-table-column>
            <el-table-column label="上次公示时间" prop="time"></el-table-column>
          </el-table>
        </el-col>
      </el-row>
    </el-main>
  </el-container>
</template>

<script>
  export default {
    name: "Index", data() {
      return {
        list: [{'name': '武汉红十字基金会', 'income': '975490581.7499406', 'outcome': '', 'time': ''}],
      }
    },
    props: {
      isshow:
        {
          type:
          Boolean
        }
    },

    methods: {
      // 跳转到detail
      change(detailname) {
        this.$emit("indexClick", detailname)
      },

    }
  }
</script>

<style scoped>
  #logo {
    width: 100vw;
    height: 300px;
    background-image: url("/static/image1.jpeg");
    background-size: auto 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-color: white;
  }
  .index_header {
    padding: 0
  }
</style>
